<template>
<div class="search-results">
  <van-list
    v-model="loading"
    :finished="finished"
    finished-text="没有更多了"
    @load="onLoad"
    :error.sync="error"
    error-text="加载失败，请点击重试"
  >
    <van-cell v-for="(item,index) in list"
              :key="index"
              :title="item.title" />
  </van-list>
</div>
</template>

<script>
import { getSearch } from '@/api/search'

export default {
name: "search-results",
  props:{
    searchText:{
      type:String,
      required:true
    }

  },
  data(){
  return{

    list: [],
    loading: false,
    finished: false,
    page:1,
    per_page:15,
    error:false
  }
  },
  methods:{

   async onLoad() {
     try {

      const { data }=await getSearch({
        page:this.page,
        per_page:this.per_page,
        q:this.searchText


      })

       // if (Math.random()>0.5){
       //   JSON.parse('dasdasd')
       // }
       //随机错误测试
       const {results}=data.data

       this.list.push(...results)

       this.loading=false
       if (results.length){
          this.page++
       }else {
         this.finished=true
       }

     }catch (err){
       this.error=true
       this.loading=false

     }

    },

  }
}
</script>

<style scoped>

</style>
